/**
 * 限制输入框只能输入带小数的数字
 *
 * @param {*} binding 指令数据
 * @param {*} event 回调事件
 * @returns
 */
const inputByIsDecimal = (binding: any, event: any) => {
  // 获取输入框内容
  const value = String(event.target.value || '');
  if (!value) return;

  // 从指令中获取参数和值
  const {
    // arg: decimalArg,
    value: decimalValue
  } = binding;

  // 整数长度，默认10位
  let intLeng = 10;
  // 小数长度，默认2位
  let decLeng = 2;
  // // 取整方式
  // let subMode = decimalArg ?? 'floor';

  if (typeof decimalValue === 'number') {
    // 小数长度
    decLeng = decimalValue;
  } else if (decimalValue instanceof Array) {
    // 整数长度
    intLeng = decimalValue[0] || 0;
    // 小数长度
    decLeng = decimalValue[1] || 0;
  }

  // console.log('inputByIsDecimal', intLeng, decLeng, subMode);

  // 判断是否非number类型
  if (!/^\d*\.?\d*$/.test(value)) {
    // 移除最后输入的字符
    event.target.value = value.substring(0, value.length - 1);
    return;
  }

  // 判断是否整数
  if (/^[0-9]+$/.test(value)) {
    // 截取长度
    const intRegStr = new RegExp(`[0-9]{${intLeng}}`);
    const intResValue = value.match(intRegStr)?.[0] ?? value;
    event.target.value = +intResValue;
    return;
  }

  // 判断是否小数点结尾
  if (/^\d*\.$/.test(value)) {
    // 验证能否输入小数
    if (!decLeng) {
      // 移除最后输入的字符
      event.target.value = value.substring(0, value.length - 1);
    }
    return;
  }

  // 不是小数点结尾，则保留小数（不进行四舍五入）
  const regStr = new RegExp(`\\d+\\.\\d{${decLeng}}`);
  const resValue = value.match(regStr)?.[0] ?? value;
  // 此处不能转number
  event.target.value = resValue;
};

export default {
  // 自定义指令 - 限制只能输入带小数的数字
  name: 'decimal',

  directive: {
    /**
     * 只调用一次，指令第一次绑定到元素时调用
     * 在这里可以进行一次性的初始化设置
     *
     * @param { HTMLElement } el
     * @param { object } binding
     * @param { string } binding.arg 取整方式
     * @param { number | array } binding.value 数字保留长度
     *
     * @example
     * v-decimal          // 保留2位小数
     * v-decimal="2"      // 保留2位小数
     * v-decimal="[10]"    // 整数10位，不保留小数
     * v-decimal="[10,2]"  // 整数10位，小数2位
     *
     * // 取整方式（暂未实现）
     * v-decimal          // 取整方式：不向上取整
     * v-decimal:round    // 取整方式：向上取整
     */
    mounted(el: any, binding: any) {
      el.addEventListener('input', inputByIsDecimal.bind(null, binding), true);
    },

    beforeUnmount(el: any) {
      el.removeEventListener('input', inputByIsDecimal);
    }
  }
};
